<template>
  <div class="container">
    <div class="top">
      <h1>广西矿产资源大数据监管平台</h1>
    </div>
    <div class="content">
      <div class="content1">
        <!-- 监管数据 -->
        <SuperData></SuperData>
        <!-- 监管分布表 -->
        <div class="Distribution">
          <div class="Distribution1">
            <TitleData title="监管分布表"></TitleData>
            <DisBiao></DisBiao>
          </div>
          <div class="Distribution2">
            <TitleData title="监管分布表"></TitleData>
            <DisBiaoTwo></DisBiaoTwo>
          </div>
        </div>
        <!-- 实时数  -->
        <div class="Real">
          <RealDataV></RealDataV>
        </div>
      </div>
      <div class="content2">
        <!-- 累计数据 -->
        <Datas></Datas>
        <!-- 地图 -->
        <div class="Map">
          <MapData></MapData>
        </div>
      </div>
      <div class="content3">
        <!-- 车数，税收 -->
        <SeveralData></SeveralData>
        <!-- 图表 -->
        <div class="TableMap">
          <div class="TableMap1">
            <!-- 税种 -->
            <div class="tax">
              <div class="tax1">
                <!-- 税种明细 -->
                <TitleData title="税种明细"></TitleData>
                <TaxData></TaxData>
              </div>
              <div class="tax2">
                <TitleData title="近六个月税收"></TitleData>
                <TaxSixData></TaxSixData>
              </div>
            </div>
            <!-- 视频 -->
            <div class="video">
              <TitleData title="现场视频"></TitleData>
              <div style=" display:flex;width: 100%;height: 90%;">
                <div class="video1">
                  <video width="380" height="380" src="../assets/video/video.mp4" controls></video>
                </div>
                <div class="video2">
                  <video width="380" height="380" controls>
                    <source src="../assets/video/video2.mp4" type="video/mp4">
                  </video>
                </div>
              </div>
            </div>
          </div>
          <div class="TableMap2">
            <TableMapData></TableMapData>
          </div>
          <div class="TableMap3">
            <div class="Enterprise">
              <TitleData title="各站点/企业财团"></TitleData>
              <EnterpriseData></EnterpriseData>
            </div>
            <div class="Mineral">
              <TitleData title="矿种明细"></TitleData>
              <MineralData></MineralData>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="footer"></div>
  </div>
</template>

<script setup>
import './BigScreen.css'
import TitleData from './components/common/TitleData.vue';
import DisBiao from './components/One/DisBiao.vue';
import DisBiaoTwo from './components/One/DisBiaoTwo.vue';
import RealDataV from './components/One/RealDataV.vue';
import SuperData from './components/One/SuperData.vue';
import EnterpriseData from './components/Three/EnterpriseData.vue';
import MineralData from './components/Three/MineralData.vue';
import SeveralData from './components/Three/SeveralData.vue';
import TableMapData from './components/Three/TableMapData.vue';
import TaxData from './components/Three/TaxData.vue';
import TaxSixData from './components/Three/TaxSixData.vue';
import Datas from './components/Two/Datas.vue';
import MapData from './components/Two/MapData.vue';
</script>

<style scoped lang="scss"></style>
